Los signos [+/-] son para expandir la entrada del post.

A Dani le ha gustado la idea así que a petición de él ahí va la explicación de como se hace, con un poco de paciencia resulta sencillo.
Nos situamos en Plantilla/Edición de HTML y buscamos el código </head> justo antes añadiremos:
<script type='text/javascript'>
// <![CDATA[
//ENTRADAS EN DESPLEGABLE POR ETIQUETAS
function toggleIt(id) {
post = document.getElementById(id);
if (post.style.display != 'none') {
post.style.display = 'none';
} else {
post.style.display = '';
}
}
function showFullPost(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost")
spans[i].style.display = 'inline';
if (spans[i].id == "readmore")
spans[i].style.display = 'none';
}
}
function showFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost")
spans[i].style.display = 'inline';
if (spans[i].id == "showlink")
spans[i].style.display = 'none';
if (spans[i].id == "hidelink")
spans[i].style.display = 'inline';
}
}
function hideFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost")
spans[i].style.display = 'none';
if (spans[i].id == "showlink")
spans[i].style.display = 'inline';
if (spans[i].id == "hidelink")
spans[i].style.display = 'none';
}
post.scrollIntoView(true);
}
function checkFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
var found = 0;
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost")
found = 1;
if ((spans[i].id == "showlink") && (found == 0))
spans[i].style.display = 'none';
}
}
function commentDisplay(json) {
for (var i = 0; i < numcomments; i++) {
var entry = json.feed.entry[i];
var alturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
alturl = alturl.replace("#", "#comment-");
if (entry.content) {
comment = entry.content.$t;
} else if (entry.summary) {
comment = entry.summary.$t;
}
var re = /<\S[^>]*>/g;
comment = comment.replace(re, "");
document.write('<a href="' + alturl + '">' + entry.author[0].name.$t + '</a> commented:<br/>');
if (comment.length < numchars)
document.write(comment + '<br/><br/>');
else
document.write(comment.substring(0, numchars) + '...<br/><br/>');
}
document.write('Widget sponsored by:<br/><a href="http://bvibes.com"><img src="http://fbvibes.com/templates/yget/images/vibes_logo.png"/></a><br/>');
}
//]]>
</script>
Guardamos los cambios y marcamos para expandir la plantilla donde buscaremos el código en color negro y añadimos las que están en rojo como se muestra a continuación:
<b:includable id='PeekABooPost' var='post'>
<div class='post uncustomized-post-template'>
<table><tr><td width='40px'>
<a expr:onclick='"javascript:toggleIt(\"" + data:post.id + "\");"' href='javascript:void(0)' style='text-decoration:none' title='Desplegar esta entrada'>[+/-]</a></td>
<td><h3 class='post-title'><a expr:href='data:post.url'><data:post.title/></a></h3></td></tr></table>
<div class='post-body' expr:id='data:post.id' style='display:none'>
<p><data:post.body/></p>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
</div>
</b:includable>
<b:includable id='main' var='top'>
<!-- posts -->
<div id='blog-posts'>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<b:include data='post' name='PeekABooPost'/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
Guardamos los cambios y listo.
¡Suerte¡
http://gemablog-.blogspot.com/2009/11/anadir-un-sitemaps-o-mapa-del-sitio.html
Muchisimas Gracias me Fue de mucha ayuda pero busque y busque y no encontro donde puedo poner en mi blog como el tuyo.. que cuando entren ami blog aparesca la primera entrada y el reto expandible con el titulo y una breve descricion de la entrada como tu blog me gustaria que me ayude si no es mucha molestia. Desde peru Apurimac Abancay Gracias ante mano por la ayuda..
http://vagabundia.blogspot.com/2009/10/resumen-posts-1-el-encabezado.html
http://vagabundia.blogspot.com/2009/10/resumen-posts-2-extractos-del-texto.html
http://vagabundia.blogspot.com/2009/10/resumen-posts-3-las-miniaturas.html
Excelente post! Gracias!!
Hola Gem@,
Revisando el blog me di cuenta que las páginas estáticas también aparecen expandibles; hay alguna manera de que no aparezcan así?
Esta es la página: http://www.tambiental.com.ar/
Espero puedas ayudarme!
http://www.pizcos.net/2010/01/paginas-estaticas-como-expandirlas.html
Hola Gema:
Por si sirve de algo, tenía el problema de que al implementar el truco me salían las paginas individuales resumidas y lo he resuelto cambiando el condicional
<b:if cond='data:blog.pageType != "item"'> por
<b:if cond='data:blog.pageType != "static_page"'>
Y me ha funcionado perfectamente.
Saludos.
Nota: solo los miembros de este blog pueden publicar comentarios.